import FullPage from 'fullpage.js'
import mixitup from 'mixitup'

export default class App {
  constructor (options) {
    this.options = options
    this.init()
  }

  init () {
    this.initFullpage()
    this.initMixitup()
  }

  /**
   * 滚动初始化
   */
  initFullpage () {
    new FullPage('#fullpage', {
      // sectionsColor: ['#212325', '#fff', '#212325', '#ebfbff'],
      sectionsColor: ['#212325', '#4BBFC3', '#7BAABE', '#ccddff'],
      anchors: ['page1', 'page2', 'page3', 'page4'],
      navigation: true,
      menu: '#menu',
      licenseKey: 'OPEN-SOURCE-GPLV3-LICENSE',
      slidesNavigation: true,
      afterRender: function () {
        $('#fullpage').find('.active').addClass('focus')
      },
      afterLoad: function (anchorLink, index) {
        console.log('滚动结束后')
        // 滚动结束后
        // $('#fullpage').children().eq(index - 1).addClass('focus')
        $('#fullpage').find('.active').addClass('focus')
      },
      onLeave: function (anchorLink, index) {
        // 滚动前
        $('#fullpage').children().removeClass('focus')
      }
    })
  }

  initMixitup () {
    mixitup('#portfoliolist', {
      load: {
        filter: '.css'
      },
      // animation: {
      //   effects: 'fade rotateZ(-180deg)',
      //   duration: 700
      // },
      classNames: {
        block: 'filters',
        elementFilter: 'filter'
        // elementSort: 'sort-btn'
      },
      selectors: {
        target: '.portfolio'
      }
    })
  }
}
